{% load static %}

<!DOCTYPE html>
<!--
This is a starter template page. Use this page to start your new project from
scratch. This page gets rid of all links and provides the needed markup only.
-->
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>提瓦特爱好家协会 | {% block title %}Starter{% endblock %}</title>

    <!-- Google Font: Source Sans Pro -->
    <link rel="stylesheet"
          href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
    <!-- Font Awesome Icons -->
    <link rel="stylesheet" href="{% static 'lib/font-awesome/css/all.css' %}">
    <!-- Theme style -->
    <link rel="stylesheet" href="{% static 'lib/admin-lte/dist/css/adminlte.css' %}">
    {% block head %}{% endblock %}
</head>
<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">

    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="{% url 'public' %}" class="nav-link">公共导航</a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="{% url 'public' %}?theme=simple" class="nav-link">简洁版导航</a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="{% url 'private' %}" class="nav-link">个人导航</a>
            </li>
        </ul>

        <!-- Right navbar links -->
        <ul class="navbar-nav ml-auto">
            <!-- Navbar Search -->
            <li class="nav-item">
                <a class="nav-link" data-widget="navbar-search" href="#" role="button">
                    <i class="fas fa-search"></i>
                </a>
                <div class="navbar-search-block">
                    <form class="form-inline" action="{% url 'search' %}" method="get">
                        <div class="input-group input-group-sm">
                            <input class="form-control form-control-navbar" type="search" placeholder="输入关键词搜索"
                                   aria-label="Search" name="q">
                            <div class="input-group-append">
                                <button class="btn btn-navbar" type="submit">
                                    <i class="fas fa-search"></i>
                                </button>
                                <button class="btn btn-navbar" type="button" data-widget="navbar-search">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </li>

            <!-- Messages Dropdown Menu -->
{#            <li class="nav-item dropdown">#}
{#                <a class="nav-link" data-toggle="dropdown" href="#">#}
{#                    <i class="far fa-comments"></i>#}
{#                    <span class="badge badge-danger navbar-badge">3</span>#}
{#                </a>#}
{#                <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <!-- Message Start -->#}
{#                        <div class="media">#}
{#                            <img src="https://blog.sblt.deali.cn:9000/Api/PicLib/Random/128/128" alt="User Avatar"#}
{#                                 class="img-size-50 mr-3 img-circle">#}
{#                            <div class="media-body">#}
{#                                <h3 class="dropdown-item-title">#}
{#                                    Brad Diesel#}
{#                                    <span class="float-right text-sm text-danger"><i class="fas fa-star"></i></span>#}
{#                                </h3>#}
{#                                <p class="text-sm">Call me whenever you can...</p>#}
{#                                <p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>#}
{#                            </div>#}
{#                        </div>#}
{#                        <!-- Message End -->#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <!-- Message Start -->#}
{#                        <div class="media">#}
{#                            <img src="https://blog.sblt.deali.cn:9000/Api/PicLib/Random/128/128" alt="User Avatar"#}
{#                                 class="img-size-50 img-circle mr-3">#}
{#                            <div class="media-body">#}
{#                                <h3 class="dropdown-item-title">#}
{#                                    John Pierce#}
{#                                    <span class="float-right text-sm text-muted"><i class="fas fa-star"></i></span>#}
{#                                </h3>#}
{#                                <p class="text-sm">I got your message bro</p>#}
{#                                <p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>#}
{#                            </div>#}
{#                        </div>#}
{#                        <!-- Message End -->#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <!-- Message Start -->#}
{#                        <div class="media">#}
{#                            <img src="https://blog.sblt.deali.cn:9000/Api/PicLib/Random/128/128" alt="User Avatar"#}
{#                                 class="img-size-50 img-circle mr-3">#}
{#                            <div class="media-body">#}
{#                                <h3 class="dropdown-item-title">#}
{#                                    Nora Silvester#}
{#                                    <span class="float-right text-sm text-warning"><i class="fas fa-star"></i></span>#}
{#                                </h3>#}
{#                                <p class="text-sm">The subject goes here</p>#}
{#                                <p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 Hours Ago</p>#}
{#                            </div>#}
{#                        </div>#}
{#                        <!-- Message End -->#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item dropdown-footer">See All Messages</a>#}
{#                </div>#}
{#            </li>#}
            <!-- Notifications Dropdown Menu -->
{#            <li class="nav-item dropdown">#}
{#                <a class="nav-link" data-toggle="dropdown" href="#">#}
{#                    <i class="far fa-bell"></i>#}
{#                    <span class="badge badge-warning navbar-badge">15</span>#}
{#                </a>#}
{#                <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">#}
{#                    <span class="dropdown-header">15 Notifications</span>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <i class="fas fa-envelope mr-2"></i> 4 new messages#}
{#                        <span class="float-right text-muted text-sm">3 mins</span>#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <i class="fas fa-users mr-2"></i> 8 friend requests#}
{#                        <span class="float-right text-muted text-sm">12 hours</span>#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item">#}
{#                        <i class="fas fa-file mr-2"></i> 3 new reports#}
{#                        <span class="float-right text-muted text-sm">2 days</span>#}
{#                    </a>#}
{#                    <div class="dropdown-divider"></div>#}
{#                    <a href="#" class="dropdown-item dropdown-footer">See All Notifications</a>#}
{#                </div>#}
{#            </li>#}
            <li class="nav-item">
                <a class="nav-link" data-widget="fullscreen" href="#" role="button">
                    <i class="fas fa-expand-arrows-alt"></i>
                </a>
            </li>
{#            <li class="nav-item">#}
{#                <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">#}
{#                    <i class="fas fa-th-large"></i>#}
{#                </a>#}
{#            </li>#}
        </ul>
    </nav>
    <!-- /.navbar -->

    <!-- Main Sidebar Container -->
    <aside class="main-sidebar sidebar-dark-primary elevation-4">
        <!-- Brand Logo -->
        <a href="{% url 'public' %}" class="brand-link">
            <img src="https://blog.sblt.deali.cn:9000/Api/PicLib/Random/128/128" alt="SiteDirectory Logo"
                 class="brand-image img-circle elevation-3"
                 style="opacity: .8">
            <span class="brand-text font-weight-light">提瓦特爱好家协会</span>
        </a>

        <!-- Sidebar -->
        <div class="sidebar">
            <!-- Sidebar user panel (optional) -->
{#            <div class="user-panel mt-3 pb-3 mb-3 d-flex">#}
{#                <div class="image">#}
{#                    <img src="https://blog.sblt.deali.cn:9000/Api/PicLib/Random/160/160" class="img-circle elevation-2"#}
{#                         alt="User Image">#}
{#                </div>#}
{#                <div class="info">#}
{#                    <a href="#" class="d-block">User</a>#}
{#                </div>#}
{#            </div>#}

            <!-- SidebarSearch Form -->
            <div class="form-inline">
                <div class="input-group" data-widget="sidebar-search">
                    <input class="form-control form-control-sidebar" type="search" placeholder="Search"
                           aria-label="Search">
                    <div class="input-group-append">
                        <button class="btn btn-sidebar">
                            <i class="fas fa-search fa-fw"></i>
                        </button>
                    </div>
                </div>
            </div>

            <!-- Sidebar Menu -->
            <nav class="mt-2">
                <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
                    data-accordion="false">
                    <!-- Add icons to the links using the .nav-icon class
                         with font-awesome or any other icon font library -->
                    {% block sidebar %}{% endblock %}
{#                    <li class="nav-item">#}
{#                        <a href="/admin" class="nav-link" target="_blank">#}
{#                            <i class="nav-icon fas fa-th"></i>#}
{#                            <p>#}
{#                                管理后台#}
{#                                <span class="right badge badge-danger">New</span>#}
{#                            </p>#}
{#                        </a>#}
{#                    </li>#}
                </ul>
            </nav>
            <!-- /.sidebar-menu -->
        </div>
        <!-- /.sidebar -->
    </aside>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0">{% block page_header %}SiteDirectory / 网站导航{% endblock %}</h1>
                    </div><!-- /.col -->
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            {% block breadcrumb %}
                                <li class="breadcrumb-item"><a href="#">Home</a></li>
                                <li class="breadcrumb-item active">Starter Page</li>
                            {% endblock %}
                        </ol>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->

        <!-- Main content -->
        <div class="content">
            <div class="container-fluid">
                {% block content %}
                {% endblock %}
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->

    <!-- Control Sidebar -->
    <aside class="control-sidebar control-sidebar-dark">
        <!-- Control sidebar content goes here -->
        <div class="p-3">
            <h5>Title</h5>
            <p>Sidebar content</p>
        </div>
    </aside>
    <!-- /.control-sidebar -->

    <!-- Main Footer -->
    <footer class="main-footer">
        <!-- To the right -->
        <div class="float-right d-none d-sm-inline">
            Anything you want
        </div>
        <!-- Default to the left -->
        <strong>Copyright &copy; 2014-2023 <a href="http://blog.deali.cn" target="_blank">StarBlog</a>.</strong> All rights reserved.
    </footer>
</div>
<!-- ./wrapper -->

<!-- REQUIRED SCRIPTS -->

<!-- jQuery -->
<script src="{% static 'lib/jquery/dist/jquery.js' %}"></script>
<!-- Bootstrap 4 -->
<script src="{% static 'lib/bootstrap/dist/js/bootstrap.bundle.js' %}"></script>
<!-- AdminLTE App -->
<script src="{% static 'lib/admin-lte/dist/js/adminlte.js' %}"></script>
<script src="{% static 'js/website.js' %}"></script>
{% block bottom %}{% endblock %}
</body>
</html>
